<!DOCTYPE html>
<html lang="en">
  <head>
    <title>详情页</title>
    ${require('raw-loader!../../component/layout/meta.html')}
    ${require('raw-loader!../../component/layout/linkjs.html')}
  </head>

  <body>
    <div class="base-page-wrap index-detail-wrap">
      <div class="detail-title-wrap">
        <h2 class="title">详情标题1</h2>
        <div class="desc-wrap">
          <div class="info">
            <span class="user">作者</span>
            <span class="time">2019-06-17 14:50</span>
          </div>
          <div class="show-wrap">
            <i class="iconfont iconeye"></i>
            <span class="num">384</span>
          </div>
        </div>
      </div>

      <div class="detail-content-wrap common-rich-wrap">
        <p>富文本</p>
        <p style="font-size: 16px">
          1、幸运，是另外一种实力
          　　大家都说C是朋友中最幸运的女人——“幸运”是个感情复杂的词，一边带着赞叹和羡慕，另一边，多少有点实力不够意外胜出的腹诽。
          　　尤其，C其貌不扬，惯性思维是：幸运是美女的专属。
          　　但是，她的确发展平顺，从基础文员做到副总经理；嫁了被人羡慕的老公，高、帅，还富，曾经是C公司的客户，当年身边围绕众多女性，最终却选择了并不突出的C；她还有几个不错的朋友，提起名字就让人眼前一亮。
          　　C的收获，看上去远远超越了她的实力和付出，所以，人们议论她幸运的同时，还有一点窥探和好奇：这么好的运气，凭什么是她？
          　　多年朋友，我特别明白C为什么幸运。
          　　很多年前的一天，我去C办公室找她下班一起健身，赶上她老板也在等电梯，我远远地望着老板的背影，问她：要迟一点走，或者换走楼梯吗？和老板同梯是不是不太自在？
          　　C说：为什么不和老板一趟电梯呢？
          　　于是，我们俩拎着健身包和老板同时乘电梯到1楼。
          　　C落落大方主动和老板攀谈，一点没有普通员工的拘谨和扭捏，甚至普及了几个健身知识，还顺便聊起附近几家味道不错的餐馆，透露其中一个是某重要客户的聚点。临别，老板亲切和我们道别。
          　　只是，我没有想到，这个电梯里的老板后来成了C的贵人，给了她关键的提升机会。
          　　很多人以为生命中的贵人是被隆重的仪式感安排好，站在聚光灯下深情等待，现实却是，ta或许就在某个不起眼的角落，在某个不经意的片段，成年累月地观察和打量你，考虑成熟才会向你伸出点石成金的金手指。
          　　所以，所谓幸运的人，都特别擅长把握稍纵即逝的机会。
          　　C结婚前，我陪她去买婚鞋。
        </p>
        <img
          width="100%"
          height="100%"
          src="https://cdn.pixabay.com/photo/2013/07/18/20/26/sea-164989_960_720.jpg"
          alt=""
        />
        <p style="font-size: 18px; font-weight: bold">内容的富文本</p>
        <table>
          <tr>
            <td>1</td>
            <td>2</td>
          </tr>
          <tr>
            <td>1</td>
            <td>2</td>
          </tr>
          <section>123</section>
          456
        </table>
      </div>

      <div class="detail-footer-wrap">
        <div class="phone-wrap">
          <i class="iconfont icondianhua"></i>
          <a href="tel:020-xxxx"><span class="num">020-xxxx</span></a>
        </div>
        <p class="desc">来打电话</p>
      </div>

      <div class="detail-bottom-wrap">
        <div class=""></div>

        <div class="btn-group">
          <button class="btn" onclick="javascript:window.location.href='/';">
            返回首页
          </button>
          <button class="btn">上一篇</button>
          <button class="btn">下一篇</button>
        </div>
      </div>

      <div class="common-product-list-wrap detail-article-wrap">
        <h2 class="product-title">XXX</h2>
        <ul class="product-list">
          <li class="normal">
            <a href="/pages/index_page/index_detail.html">
              <div class="img-wrap">
                <img
                  width="100%"
                  height="100%"
                  src="https://cdn.pixabay.com/photo/2013/07/18/20/26/sea-164989_960_720.jpg"
                  alt=""
                />
              </div>
              <div class="wrap-left">
                <p class="title">
                  标题1
                </p>
                <div class="desc-wrap">
                  <div class="read-wrap">
                    <span class="label-new">热</span>
                    <i class="iconfont iconeye"></i>
                    <span class="num">384</span>
                  </div>
                  <div class="time">2019-01-02</div>
                </div>
              </div>
            </a>
          </li>
          <li class="normal">
            <a href="/pages/index_page/index_detail.html">
              <div class="img-wrap">
                <img
                  width="100%"
                  height="100%"
                  src="https://cdn.pixabay.com/photo/2013/07/18/20/26/sea-164989_960_720.jpg"
                  alt=""
                />
              </div>
              <div class="wrap-left">
                <p class="title">
                  标题1
                </p>
                <div class="desc-wrap">
                  <div class="read-wrap">
                    <span class="label-new">热</span>
                    <i class="iconfont iconeye"></i>
                    <span class="num">384</span>
                  </div>
                  <div class="time">2019-01-02</div>
                </div>
              </div>
            </a>
          </li>
        </ul>

        ${require('raw-loader!../../component/layout/loading.html')}
      </div>
    </div>
  </body>
  <script>
    layer.open({
      content: "操作成功提示测试",
      skin: "msg",
      time: 2, //2秒后自动关闭
    });
  </script>
</html>
